<template>
	<view class="distribution">
		<view class="imageBackground" :style="{ '--bg-image': `url(${moban1})` }">
			<view class="recordsList">

				<view class="flex-between">
					<view class="flex-start-center">
						<image class="avatar" :src="userInfo.avatar" mode=""></image>

						<view class="flex-columns" style="margin-left: 20rpx;height: 90rpx;">
							<view class="flex-start-center ">
								<view style=" font-size: 32rpx;font-weight: 400;color: #fff;">{{associateGetInfo.name}}
								</view>
								<view class="margin-left_20rpx">
									<view v-if="userInfo.level_id==1" class="">
										<image class="noVip" src="https://z4a.net/images/2024/07/17/-1617.png"
											mode="widthFix">
										</image>
									</view>
									<view class="" v-else>
										<image class="Vip" src="https://z4a.net/images/2024/07/17/-1134.png"
											mode="widthFix">
										</image>
									</view>
								</view>
							</view>
							<text style="color: rgb(255, 255, 255);">身份: 合伙人</text>
						</view>
					</view>

				</view>
				<!-- 团队 -->
				<view class="team " :style="{ '--bg-images': `url(${partner})` }">
					<view class="top">
						<view class="flex-column">
							<text style="color: rgb(153, 153, 153);font-size: 32rpx;margin-bottom: 10rpx;">今日收益</text>
							<text class="font-weight_bold font-size_28rpx">{{associateGetInfo.todayIncome}}</text>
						</view>
						<view class="flex-column">
							<text
								style="color: rgb(153, 153, 153);font-size: 31rpx;margin-bottom: 10rpx;">今日新增推广员(人)</text>
							<text class="font-weight_bold font-size_28rpx">{{associateGetInfo.todayAddPromoter}}</text>
						</view>
					</view>
					<view class="detailedStatistics">
						<view class="flex-between">
							<view style="color: rgb(153, 153, 153);">
								{{'可提现收益('+currency_name+')'}}
							</view>
							<view style="color: rgb(153, 153, 153);" @click="viewDetail()">
								查看明细

								<uni-icons type="right" color="rgb(153, 153, 153)" size="15"></uni-icons>
							</view>
						</view>
						<view class="flex-between">
							<view class="font-weight_bold"
								style="margin: 28rpx 0;color: rgb(255, 2, 2);font-size: 38rpx;">
								{{associateGetInfo.surplus_income}}
							</view>
							<view v-if="getConfig.withdrawal_switch==1" class="withdrawalBtn flex"
								@click="withdrawal()">
								<text>提现</text>
							</view>
						</view>
						<!-- 数据明细 -->
						<view class="flex-between dataDetails">
							<view class="flex-column" v-for="(item,i) in dataDetails" :key="i">
								<view class="margin-bottom_10rpx" style="color:rgb(102, 102, 102);font-size: 28rpx;">
									{{item.text}}
								</view>
								<view class="font-weight_bold" style="color: rgb(51, 51, 51);font-size: 28rpx;">
									{{totelName(item.number)}}
								</view>

							</view>

						</view>
						<view class="flex-between dataDetails margin-top_40rpx">
							<view class="flex-column" style="width: 186rpx;" v-for="(item,i) in dataDetailsUser" :key="i" @click="userListFn()">
								<view class="margin-bottom_10rpx" style="color:rgb(102, 102, 102);font-size: 28rpx;">
									{{item.text}}
								</view>
								<view class="font-weight_bold" style="color: rgb(51, 51, 51);font-size: 28rpx;">
									{{totelName(item.number)}}
								</view>

							</view>

						</view>
					</view>
				</view>


			</view>
		</view>
		<view class="tabCard">
			<view v-for="(item,i) in list" :key="i">
				<block
					v-if="(!(getConfig.withdrawal_switch==2&&item.text=='提现记录'))&&(!(getConfig.distribution_level==0&&item.text=='我的团队'))">

					<view @click="scanFn(item)" class=" comprehensiveScoreList flex-between">
						<view class="flex">
							<image class="avater" :src="item.img" mode=""></image>
							<view class="rightContent">
								<view class="authorizationTitle">
									{{item.text}}

								</view>


							</view>
						</view>

						<uni-icons type="right" color="rgb(153, 153, 153)" size="15"></uni-icons>

					</view>
				</block>


			</view>
		</view>
		<sunui-popup ref="myPackagePopup">
			<template v-slot:content>

				<view class="backgroundImg" :style="{ '--bg-image': `url(${getConfig.invite_img})` }">

					<image class="qrcode" :src="userInfo.invite_url" mode=""></image>
				</view>

			</template>
		</sunui-popup>


	</view>
</template>

<script>
	export default {
		components: {

		},
		data() {
			return {
				user: this.$img.user,
				explain: this.$img.explain,
				partner: this.$img.partnerBg,
				moban1: this.$img.moban1,
				currency_name: uni.getStorageSync("system").currency_name,
				tabIndex: 4,
				userInfos: uni.getStorageSync("userInfo"),
				myTeam: null,
				userInfo: null,
				getConfig: null,
				// 数据明细
				dataDetails: [{
						number: 3.00,
						text: '累计收益(' + uni.getStorageSync("system").currency_name + ')'
					},
					{
						number: 3.00,
						text: '本月收益(' + uni.getStorageSync("system").currency_name + ')'
					},
					{
						number: 18000,
						text: '昨日收益(' + uni.getStorageSync("system").currency_name + ')'
					},

				],
				dataDetailsUser: [{
						number: 3.00,
						text: '累计推广员'
					},
					{
						number: 3.00,
						text: '累计名下用户'
					},
					{
						number: 18000,
						text: '今日新增用户'
					},

				],

				list: [{
						img: this.$img.user,
						text: '推广员列表',

						url: '/pagesB/index/listOfPromoters',


					},
					{
						img: this.$img.wallet,

						text: '提现记录',

						url: '/pagesA/personalCenter/distributionRecords',


					},
					{
						img: this.$img.achievement,
						text: '业绩明细',

						url: '/pagesB/index/promotionDetails',

					},
					{
						img: this.$img.explain,
						text: '合伙人说明',

						url: '/pagesA/personalCenter/distributionInstructions',

					},
					{
						img: this.$img.poster,
						text: '海报设置',

						url: '/pagesB/index/posterSetup',

					},
					// {
					// 	img: this.$img.poster,
					// 	text: '推广海报',
					// 	poster: true

					// },


				],
				associateGetInfo: {}
			}
		},
		onLoad() {
			this.associateGetInfoFn()
			this.userInfoFn()
			this.init()

		},
		onShow() {
			this.associateGetInfoFn()
		},
		mounted() {
			this.userInfoFn()
			this.associateGetInfoFn()
			this.init()
		},
		methods: {
			userListFn(){
				this.$sun.navGo('/pagesB/index/partnerUserList')
			},
			async associateGetInfoFn() {
				const result = await this.$http.post({
					url: this.$api.associateGetInfo,
					data: {
						user_id: uni.getStorageSync("userInfo").id



					},
					headers: {
						'Authorization': this.userInfos.token
					}

				})

				if (result.code == 0) {
					console.log('data', result.data);
					this.associateGetInfo = result.data
					wx.setStorageSync('associateGetInfo', this.associateGetInfo);

					this.dataDetails.forEach((item) => {
						switch (item.text) {
							case '累计收益(' + uni.getStorageSync("system").currency_name + ')':
								item.number = result.data.totayIncome;
								break;
							case '本月收益(' + uni.getStorageSync("system").currency_name + ')':
								item.number = result.data.monthIncome;
								break;
							case '昨日收益(' + uni.getStorageSync("system").currency_name + ')':
								item.number = result.data.yesterdayIncome;
								break;

						}
					})
					this.dataDetailsUser.forEach((item) => {
						switch (item.text) {
							case '累计推广员':
								item.number = result.data.promoterTotay;
								break;
							case '累计名下用户':
								item.number = result.data.userTotay;
								break;
							case '今日新增用户':
								item.number = result.data.todayAddUser;
								break;

						}
					})


				} else {
					this.$sun.toast(result.message, 'none')
				}
			},
			async userInfoFn() {
				const result = await this.$http.post({
					url: this.$api.userInfo,
					data: {




					},
					headers: {
						'Authorization': this.userInfos.token
					}

				})

				if (result.code == 0) {
					console.log('data', result.data);
					this.userInfo = result.data


				} else {
					this.$sun.toast(result.message, 'none')
				}
			},
			async init() {

				const resConfig = await this.$http.post({
					url: this.$api.config,
					data: {

					},
					headers: {

					}

				})

				if (resConfig.code == 0) {




					// this.$sun.toast(resConfig.message, 'none')
					this.getConfig = resConfig.data


					console.log(this.getConfig, 'this.getConfig')

				} else {

					this.$sun.toast(resConfig.message, 'none')
				}

				// const res = await this.$http.post({
				// 	url: this.$api.income,
				// 	data: {


				// 	},
				// 	headers: {
				// 		'Authorization': this.userInfos.token
				// 	}

				// })
				// console.log(res)
				// if (res.code == 0) {
				// 	// 跳转到登录页面
				// 	this.myTeam = res.data
				// 	this.dataDetails.forEach((item) => {
				// 		switch (item.text) {
				// 			case '累计收益(' + uni.getStorageSync("system").currency_name + ')':
				// 				item.number = res.data.year_amount;
				// 				break;
				// 			case '本月收益(' + uni.getStorageSync("system").currency_name + ')':
				// 				item.number = res.data.month_amount;
				// 				break;
				// 			case '昨日收益(' + uni.getStorageSync("system").currency_name + ')':
				// 				item.number = res.data.today_amount;
				// 				break;

				// 		}
				// 	})

				// 	console.log(res.data)
				// 	// this.$sun.toast(res.message, 'none')
				// } else {

				// 	this.$sun.toast(res.message, 'none')
				// }
			},

			withdrawal() {
				this.$sun.navGo('/pagesB/index/applyWithdrawalPartner')
			},
			// 查看明细
			viewDetail() {
				this.$sun.navGo('/pagesB/index/promotionDetails')
			},
			scanFn(item) {
				console.log(item)
				if (item.poster) {
					this.$refs.myPackagePopup.show({
						style: 'padding:50rpx;',
						bottomClose: true,
						shadeClose: true,
						topclose: true
					});
				} else if(item.text=='提现记录') {
					this.$sun.navGo('/pagesA/personalCenter/distributionRecords',{type:2})
				}else{
					this.$sun.navGo(item.url)
				}



			},

		},
		computed: {
			totelName: function() {
				return function(num) {

					if (num >= 10000) {
						let remainder = num % 10000;
						let quotient = Math.floor(num / 10000);
						let decimal = Math.floor(remainder / 1000);
						return quotient + '.' + decimal + '万';
					} else {
						return num.toString();
					}
				};
			}
		},
	}
</script>

<style lang="less" scoped>
	page {
		background: #f6f6f6;
	}

	.backgroundImg {

		width: 696rpx;
		height: 860rpx;
		background-repeat: no-repeat;
		background-size: contain;
		background-image: (var(--bg-image));
		position: relative;

		.qrcode {
			width: 245rpx;
			height: 245rpx;
			position: absolute;
			bottom: 100rpx;
			left: 225rpx;
		}
	}

	.distribution {
		.imageBackground {
			height: 745rpx;
			background-repeat: no-repeat;
			// background-size: contain;
			background-image: (var(--bg-image));
			background-size: cover;
			// background-image: url('http://yunhunjian123.oss-cn-shanghai.aliyuncs.com/2024-06-17/c2a31202406171956142126.png');
			padding: 30rpx;

			// http://yunhunjian123.oss-cn-shanghai.aliyuncs.com/2024-06-17/c2a31202406171956142126.png
			.recordsList {
				padding-bottom: 30rpx;
				margin-top: 60rpx;

				.noVip {
					width: 136rpx;
					height: 40rpx;
					display: block;
				}

				.Vip {
					width: 136rpx;
					height: 40rpx;
					isplay: block;
				}

				.avatar {
					width: 130rpx;
					height: 130rpx;
					border-radius: 50%;
				}

				.withdrawalBtn {
					width: 120rpx;
					height: 52rpx;
					border-radius: 50rpx;
					color: rgb(172, 130, 73);
					background: rgb(255, 255, 255);
				}

				.team {
					margin-top: 40rpx;
					// height: 562rpx;
					background-repeat: no-repeat;
					background-size: cover;
					background-image: (var(--bg-images));

					// background-image: url('https://dazi.weijuyunke.cn/images/组合 1982.png');

					.top {

						display: flex;
						justify-content: space-around;
						align-items: self-end;
						padding: 48rpx;
					}

					.detailedStatistics {
						padding: 0rpx 38rpx 26rpx 38rpx;

					}

					.withdrawalBtn {
						width: 120rpx;
						height: 52rpx;
						border-radius: 50rpx;
						color: #fff;
						background: #2478ED;
					}
				}
			}

		}

		.tabCard {
			background-color: #fff;

			margin: 114rpx 24rpx;

			border-radius: 10rpx;
			padding: 0 24rpx;

			.comprehensiveScoreList {
				height: 120rpx;
				border-bottom: 2rpx solid #F5F6FB;


				.avater {
					width: 56rpx;
					height: 56rpx;
					margin-right: 18rpx;

				}

				.rightContent {
					.authorizationTitle {
						color: #000;
						font-size: 28rpx;
						font-weight: 600;

					}

					.authorizationText {
						color: #666;
						font-family: Inter;
						font-size: 24rpx;
					}

				}

				.btnFinish {
					// 		width: 140rpx;
					// 		height: 64rpx;
					// 		border-radius: 76rpx;
					// 		border: 2rpx solid #D9D9D9;

					// 		background: #FFF;
					.arrowImg {
						width: 46rpx;
						height: 46rpx;
					}

					.codyImg {
						margin-left: 10rpx;
						width: 28rpx;
						height: 28rpx;
					}

				}



			}

		}
	}
</style>